<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>{$ridwall['yyyzhuti']}</title>
<script src="{RES}shake/mobile/shake/jquery.js"></script>
<script type="text/javascript" src="{RES}files/js/semantic.min.js"></script> 
<script src="{RES}shake/mobile/shake/jquery-ui.min.js"></script>
<script src="{RES}shake/mobile/shake/jquery.flip.min.js"></script>
<link rel="stylesheet" href="{RES}shake/css/shake.css" type="text/css">
<link rel="stylesheet" href="{RES}files/css/semantic.min.css" type="text/css">
<script>
var scrwidth;
$(function(){
var hoko;
var ss=3;
var isstop = 0;
var tt;
var stime=3*1000;
function getPoint(){
  var anitime=scrwidth/{$ridwall["yyyendtime"]};
  var i=0;
  $.ajax({ 
    type: "post", 
	url :"{php echo $this->createMobileUrl('date')}",
    dataType:'json', 
    data: 'judge=1&rid={$rid}',
	success: function(json){
    doit();
       function doit(){
        $("#ranking div:eq("+i+")").children('span').flip({
        speed:500,
        color: '#f93',
        content:'<p><img class="ui avatar image" src='+json[i]['avatar']+'><xb>'+json[i]['phone']+'</xb></p>',
        onBefore: function(){
           if(json[i]['point']*anitime >= scrwidth){
		
            $("#ranking div:eq("+i+")").children('span').css({"width":scrwidth,"visibility":"visible"});
		    for(i=0;i<{$ridwall['yyyshowperson']};i++){
			   $("#ranking div:eq("+i+")").children('span').html('<p><img class="ui avatar image" src='+json[i]['avatar']+'><xb>'+json[i]['phone']+'</xb></p>');
			}
            isstop = 1;
          }else{
            $("#ranking div:eq("+i+")").children('span').css("width",json[i]['point']*anitime);

     

		}},

        })

          i++;

          if(i<{$ridwall['yyyshowperson']} & isstop == 0) setTimeout(doit,100);

                  }


 }



    });

   if($("#ranking div:eq(0)").children('span').width()>=scrwidth){echo(anitime);$("#final").show("fast");clearTimeout(hoko);return false;}

   hoko=setTimeout(getPoint,stime) ;

   

 } 

 

   

     function start(){ 

  

  $.ajax({ 

  type: "post", 

  url : "{php echo $this->createMobileUrl('date')}",

  dataType:'text', 

  data: 'judge=3&rid={$rid}',

  success: function(data){}});

   }

  function end(){ 

  

  $.ajax({ 

  type: "post", 

  url : "{php echo $this->createMobileUrl('date')}",

  dataType:'text', 

  data: 'judge=4&rid={$rid}',

  success: function(data){}});

   }

  

  function getman(){

  $.ajax({ 

  type: "post", 

  url : "{php echo $this->createMobileUrl('date')}",

  dataType:'text', 

  data: 'judge=2&rid={$rid}',

  success: function(data){

      $("#man").html(data); 

      }

    

    });

   }

   

 function count(){

    $("#bignum").html(ss);

    ss=ss-1  

    tt=setTimeout(count,1000)

    if(ss==-1){

        $("#bignum").hide(0);

        $("#ranking").show().ready(function() {

scrwidth = $('div .progress-bar').width()-61;

        });

        clearTimeout(tt);

        start();

        getPoint();

        }

  }

  function echo(anitime){

      var str="";

      $("#ranking").hide(0);

      for(i=0;i<{$ridwall['yyyshowperson']};i++){

          score=parseInt($("#ranking div:eq("+i+")").children('span').width())/anitime;

          str += "<tr>";

          str += "<td>第"+(i+1)+"名</td>";

          str += "<td>"+$("#ranking div:eq("+i+")").children('span').html();+"</td>";

          str += "<td>"+parseInt(score)+"</td>";

          str += "</tr>"

          }

       $("#finaltable").append(str);

       end();

      }

 $("#c").click(function(){

     clearInterval(yuni);

     count();

     })

  $("#qrcode").click(function(){

      $(this).hide();

      })

   

   var yuni=setInterval(getman,1000);

   

})

</script>

</head>



<body>



<div class="page">

<!-- 头部 -->

<div class="head">

<div class="head_left">

<div class="head_info">

<h1>{$ridwall['yyyzhuti']}</h1>

</div>

<div class="head_flag"></div>

</div>



<div class="head_right">

<img alt="bababa" src="{RES}shake/css/images/bullhorn.png" />

<h2>添加</h2><h1>{$account['name']}</h1><h3>在<span>主菜单</span>下发送摇一摇 </h3><h2 style="float:right;" >
<span onclick="requestFullScreen()" id="fulls"></span></h2>
<style>
#fulls {
background-color:#ccc
float: left;
display: inline-block;
width: 35px;
height: 35px;
background: url({RES}icons.png) no-repeat;
text-indent: -9999em;
margin-right: 10px;
background-position: 0 -40px;
}
</style>
</div>

<div class="clear"></div>

</div>



<div id="ranking" class="ui page grid">

   <?php
   $class=array('blue stripes','orange shine','green glow');
   for($i=0;$i<$ridwall["yyyshowperson"];$i++){?>
   <div class='progress-bar  <?php echo $class[$i] ;?>'><su><?php echo $i + 1 ; ?></su><su2></su2>
   <span></span> </div>
   <?php }?>
</div>

<!--<div id="dd"><input id="ddd" type="button" value="初始化游戏"></div>-->
<div id="bignum" class="ui page grid">

  <div class="biginner row">

  <div class="ten wide column">

  <center>

  <img src="{$_W['attachurl']}{$cfg['erweima']}"></center>

  </div>

  <div class="six wide column">

    <a id="c" href="javascript:void(0)"><img style="width:100px;" src="{RES}shake/css/images/shake.gif"><p>开始游戏</p></a>

    <div class="manbox">已连接人数<span id="man"> 0 </span></div>

    </div>

  </div>

</div>

<div id="final" class="ui page grid">

  <table id="finaltable" class="ui celled table segment">

  <thead>

     <tr>

        <th>名次</th>

        <th>微信昵称</th>

        <th>摇晃次数</th>

     </tr>

  </thead>

     

  </table>

</div>



</div>

<audio autoplay src="" loop></audio>



  <img class="bg" src="{RES}shake/images/kuxuan.jpg"/>

</body>
<script>
function requestFullScreen() {
     var de = document.documentElement;
     if (de.requestFullscreen) {
         de.requestFullscreen();
     } else if (de.mozRequestFullScreen) {
         de.mozRequestFullScreen();
     } else if (de.webkitRequestFullScreen) {
         de.webkitRequestFullScreen();
     }
}
</script>
</html>